<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    <style>
        /* 重要说明 */
        /* 使用 !important 是一个坏习惯，应该尽量避免，因为这破坏了样式表中的固有的级联规则 使得调试找 bug 变得更加困难了。 */
        /* 当两条相互冲突的带有 !important 规则的声明被应用到相同的元素上时，拥有更大优先级的声明将会被采用。 */

        /* 以下实例我们在查看 CSS 源码时就不是很清楚哪种颜色最重要： */
        #myid {
            background-color: blue !important;
        }

        .myclass {
            background-color: gray !important;
        }

        p {
            background-color: red !important;
        }

        /* 使用建议： */
        /* 一定要优先考虑使用样式规则的优先级来解决问题而不是 !important */
        /* 只有在需要覆盖全站或外部 CSS 的特定页面中使用 !important */
        /* 永远不要在你的插件中使用 !important */
        /* 永远不要在全站范围的 CSS 代码中使用 !important */
    </style>
</head>

<body>

    <p>段落中的一些文本内容！！！</p>

    <p class="myclass">段落中的一些文本内容！！！</p>

    <p id="myid">段落中的一些文本内容！！！</p>

</body>

</html>